<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>随着屏幕高度变化隐藏或显示返回顶部导航栏</title>
<style>
#go_top {
	left: 50%;	
	position: fixed;
	bottom: 5px;
	background: #fff url(images/bg_float_top.gif) no-repeat center -2px;
	margin-left: 500px;
	width: 18px;
	padding: 16px 0 0;
	border: solid 1px #dbdbdb;
	border-radius: 2px;
  _top: expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeight-5); 	
  _position: absolute;
}
#go_top a, #go_top a:hover {
	color: #656A77;
	display: block;
	font-size: 12px;
	padding-bottom: 6px;
	padding-left: 3px;
	text-align: left;
}
#go_top a { text-decoration: none; }
#go_top a:hover { color: #f60; }
</style>
 

<script src="js/jquery.js" type="text/javascript"></script>
</head>

<body>
<div style="height:1800px;"></div>

<p class="" id="go_top"><a href="javascript:scroll(0,0)">返回顶部</a></p>


<script>
$(function(){
  $(window).scroll(function(){
	if($(window).scrollTop()>=1){
		$("#go_top").show();
	}else{
		$("#go_top").hide();
	}
  }); 
})
</script>
</body>
</html>
